.educational-content {
	display: flex;

	.educational-content__wrapper {
		flex: 70%;
	}

	.educational-content__illustration {
		flex: 30%;
		margin-left: 1rem;
		text-align: center;
	}

	h2 {
		font-weight: 500;
		font-size: $font-body-large;
		margin-bottom: 8px;
	}

	.educational-content__link {
		margin-bottom: 12px;
		display: flex;

		button {
			color: var(--color-link);
			font-size: 1rem;
			cursor: pointer;

			&:hover {
				color: var(--color-link-dark);
			}
		}

		&:last-child {
			margin-bottom: 0;
		}

		.gridicon,
		.material-icon {
			margin-right: 0.5rem;
			fill: var(--color-neutral-60);
		}

		a,
		button,
		.inline-support-link {
			&:focus-visible {
				box-shadow: inset 0 0 0 2px var(--color-primary);
				outline: none;
			}
		}
	}
}
